<template>
    <div id="salaryTime">
        <!-- 查询 -->
        <div style="width: 100%;height: 85px;background-color: #FAFAFA;padding-top: 1%;">
            <el-col :xs="3" :sm="2" :md="2" :lg="2" style="margin:0 0 0 1%">
                <el-input placeholder="工号" v-model="UserCode"></el-input>
            </el-col>
            <el-col :xs="3" :sm="2" :md="2" :lg="2" style="margin:0 1%">
                <el-input placeholder="姓名" v-model="UserName"></el-input>
            </el-col>
            <!-- 工厂 -->
            <el-col :xs="3" :sm="2" :md="2" :lg="2">
                <el-select @change="GetDepart" v-model="valueFactory" clearable placeholder="隶属工厂">
                    <el-option v-for="item in FactoryOptions" :key="item.ID" :label="item.FactoryName" :value="item.ID"></el-option>
                </el-select>
            </el-col>
            <!-- 部门 -->
            <el-col :xs="3" :sm="2" :md="2" :lg="2" style="margin: 0 1%">
                <el-select @change="GetOfficeDuty"  v-model="valueDepart" clearable placeholder="隶属部门">
                    <el-option v-for="item in DepartOptions" :key="item.DepartmentCode" :label="item.DepartmentName" :value="item.DepartmentCode"></el-option>
                </el-select>
            </el-col>
            <!-- 科室 -->
            <el-col :xs="3" :sm="2" :md="2" :lg="2">
                <el-select  v-model="valueOffice" clearable placeholder="隶属科室">
                    <el-option v-for="item in OfficeOptions" :key="item.OfficeCode" :label="item.OfficeName" :value="item.OfficeCode"></el-option>
                </el-select>
            </el-col>
            <!-- 职务   职级 -->
            <el-col label="职务职级" :xs="3" :sm="2" :md="2" :lg="2"  style="margin: 0 1%">
                <el-select v-model="valueDuty" clearable placeholder="请选择">
                    <el-option  v-for="item in DutyOptions" :key="item.ID" :label="item.RankDuty" :value="item.ID"></el-option>
                </el-select>
            </el-col>
            <el-col :xs="3" :sm="3" :md="3" :lg="3" style="text-align: left">
                <el-button type="primary" @click="SelectTimeTable">查询</el-button>
            </el-col>
        </div>
        <!-- 表格 -->
        <el-table  max-height="600" class="table_Time" stripe border ref="TimeTable" :data="TimeTableData" tooltip-effect="dark"
                   style="width: 88%;text-align: center !important;">
            <el-table-column prop="index" label="序号"></el-table-column>
            <el-table-column prop="UserCode" sortable label="工号"></el-table-column>
            <el-table-column prop="UserName" label="姓名"></el-table-column>
            <el-table-column prop="Sex" sortable label="性别"></el-table-column>
            <el-table-column prop="FactoryName" sortable label="工厂"></el-table-column>
            <el-table-column prop="DepartmentName" sortable label="部门"></el-table-column>
            <el-table-column prop="OfficeName" sortable label="科室"></el-table-column>
            <el-table-column prop="RankDuty" sortable label="职务职级"></el-table-column>
            <!-- 加班费  薪资 -->
            <el-table-column label="计件工资">
                <template scope="scope">
                    <el-button size="small" @click="handleOver(scope.$index, scope.row)" type="danger">计件工资</el-button>
                </template>
            </el-table-column>
            <el-table-column label="薪资">
                <template scope="scope" >
                    <el-button size="small" @click="handleEmSalary(scope.$index, scope.row)" type="success">计算薪资</el-button>
                </template>
            </el-table-column>
            <!-- 操作人员 -->
            <el-table-column prop="OpeartionUseID" label="操作人员工号" v-if="false"></el-table-column>
            <el-table-column prop="OpeartionUseName" label="操作人员"></el-table-column>
            <el-table-column prop="ModifyDate" sortable label="时间"></el-table-column>
        </el-table>
        <!-- 分页 -->
        <div class="block" style="text-align: right;padding: 4% 1% 0 0">       <!-- , jumper 加到layout里面 前往第 几 页     -->
            <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-size="PageCount" :page-sizes="[10, 20, 30, 40,50]"
                           :current-page="CurrentPage"  layout="total,sizes, prev, pager, next" :total="Total"></el-pagination>
        </div>
        <!-- 计算薪资 -->
        <el-dialog title="计算薪资" :visible.sync="TimeFormVisible">
            <el-form :model="formTime" style="margin:auto;width: 70%">
                <el-form-item label="工号 ：" style="text-align: left">
                    <span>{{_JobNumber}}</span>
                </el-form-item>
                <el-form-item style="font-size: 18px;text-align: left">
                    <div style="display: flex;height: 60px">
                        <div style="flex: 1.5;font-size: 18px;font-weight: 600">固定工资</div>
                        <div style="flex: 2">应发 ：<span>{{formTime.Y_BasicWage}}</span></div>
                        <div style="flex: 3">
                            <el-form-item label="实发 ：">
                                <el-input v-model="formTime.S_BasicWage" style="width: 50%"></el-input>
                            </el-form-item>
                        </div>
                    </div>
                    <div style="display: flex;height: 60px">
                        <div style="flex: 1.5;font-size: 18px;font-weight: 600">考核工资</div>
                        <div style="flex: 2">应发 ：<span>{{formTime.Y_AchievementBonus}}</span></div>
                        <div style="flex: 3">
                            <el-form-item label="实发 ：">
                                <el-input v-model="formTime.S_AchievementBonus" style="width: 50%"></el-input>
                            </el-form-item>
                        </div>
                    </div>
                    <div style="display: flex;height: 60px">
                        <div style="flex: 1.5;font-size: 18px;font-weight: 600">岗位津贴</div>
                        <div style="flex: 2">应发 ：<span>{{formTime.Y_PostAllowance}}</span></div>
                        <div style="flex: 3">
                            <el-form-item label="实发 ：">
                                <el-input v-model="formTime.S_PostAllowance" style="width: 50%"></el-input>
                            </el-form-item>
                        </div>
                    </div>
                    <div style="display: flex;height: 60px">
                        <div style="flex: 1.5;font-size: 18px;font-weight: 600">全勤奖</div>
                        <div style="flex: 2">应发 ：<span>{{formTime.Y_PerfectAttendance}}</span></div>
                        <div style="flex: 3">
                            <el-form-item label="实发 ：">
                                <el-input v-model="formTime.S_PerfectAttendance" style="width: 50%"></el-input>
                            </el-form-item>
                        </div>
                    </div>
                    <div style="display: flex;height: 60px">
                        <div style="flex: 1.5;font-size: 18px;font-weight: 600">计件工资</div>
                        <div style="flex: 2">应发 ：<span>{{formTime.Y_PieceWorkWage}}</span></div>
                        <div style="flex: 3">
                            <el-form-item label="实发 ：">
                                <el-input v-model="formTime.S_PieceWorkWage" style="width: 50%"></el-input>
                            </el-form-item>
                        </div>
                    </div>
                    <div style="font-size: 18px;font-weight: 600;text-align: right">总计：<span>{{PayTotal}}</span></div>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="TimeFormVisible = false">取 消</el-button>
                <el-button type="danger" @click="TimeForm" >确定</el-button>
            </div>
        </el-dialog>
        <!-- 计件工资 表格 -->
        <el-dialog title="计算计件工资" :visible.sync="OverFormVisible">
            <el-form :model="formOver" style="text-align:center;margin:auto;width: 90%">
                <el-form-item label="工号 ：">
                    <div style="display: flex;">
                        <div style="flex: 5;text-align: left;">{{_JobNumber}}</div>
                        <div style="flex: 1;text-align: center;">
                            <el-button type="success"  @click="AddOver">新增</el-button>
                        </div>
                    </div>
                </el-form-item>
                <el-form-item style="margin: auto;width: 100%">
                    <el-table max-height="600" class="table_Time" stripe border ref="OverTable" :data="tableOver" tooltip-effect="dark"
                              style="width: 100%;">
                        <el-table-column prop="index" sortable label="序号"></el-table-column>
                        <el-table-column prop="ID" label="唯一标识" v-if="false"></el-table-column>
                        <el-table-column prop="UserCode" sortable label="工号"></el-table-column>
                        <el-table-column prop="WorkDate" sortable label="日期"></el-table-column>
                        <!-- 工站  物料 -->
                        <el-table-column prop="WorkStationNum" sortable label="工站代号"></el-table-column>
                        <el-table-column prop="WorkStationName" label="工站名称"></el-table-column>
                        <el-table-column prop="MaterielCode" sortable label="物料唯一编码" v-if="false"></el-table-column>
                        <el-table-column prop="MaterielNum" sortable label="物料代号"></el-table-column>
                        <el-table-column prop="MaterielName" label="物料名称"></el-table-column>
                        <el-table-column prop="Description" label="作业描述"></el-table-column>
                        <!-- 质量  工资 -->
                        <el-table-column prop="Quantity" sortable label="数量"></el-table-column>
                        <el-table-column prop="UnitPrice" sortable label="单价"></el-table-column>
                        <el-table-column prop="Wage" sortable label="计件工资"></el-table-column>
                        <!-- 操作 -->
                        <el-table-column prop="OperationUserID" sortable label="用户ID" v-if="false"></el-table-column>
                        <el-table-column prop="OperationUserName" sortable label="用户"></el-table-column>
                        <el-table-column prop="ModifyDate" sortable label="时间"></el-table-column>
                        <!-- 计件工资  编辑  修改-->
                        <el-table-column label="编辑">
                            <template scope="scope" >
                                <el-button size="small" type="primary" @click="EditHandleOver(scope.$index, scope.row)">编辑</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="OverFormVisible = false">取 消</el-button>
                <el-button type="danger" @click="TimePieceForm" >确定</el-button>
            </div>
        </el-dialog>
        <!-- 新增 计件工资 -->
        <el-dialog title="添加计件工资" :visible.sync="AddOverFormVisible">
            <el-form :model="AddformOver" style="text-align: left;margin: auto;width: 90%;">
                <!-- 日期 新增 》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》。 -->
                <el-form-item  label="日期"  :label-width="AddformLabelWidthOver">
                    <div class="block">
                        <el-date-picker
                                v-model="AddformOver.WorkDate"
                                type="date"
                                placeholder="选择日期" >
                        </el-date-picker>
                    </div>
                </el-form-item>
                <!-- 数量 -->
                <el-form-item  label="数量"  :label-width="AddformLabelWidthOver">
                    <el-input v-model="AddformOver.Quantity" auto-complete="off" style="width: 50%"></el-input>
                </el-form-item>
                <!-- 选择计件基础报表里面的  工站 物料 作业描述 -->
                <el-form-item :label-width="AddformLabelWidthOver">
                    <!-- 只能选择一行 -->
                    <span>只能选择一行</span>
                    <el-table @selection-change="handleSelectionChange" max-height="600" class="table_Time" stripe border ref="StationTable" :data="StationMarielTable" tooltip-effect="dark"
                               style="width: 100%;text-align: center !important;">
                        <el-table-column type="selection" width="55" label="勾选"></el-table-column>
                        <el-table-column prop="index" label="序号"></el-table-column>
                        <el-table-column prop="ID" label="ID" v-if="false"></el-table-column>
                        <el-table-column prop="WorkStationNum" sortable label="工站代号"></el-table-column>
                        <el-table-column prop="WorkStationName" label="工站名称"></el-table-column>
                        <el-table-column prop="WorkContent" label="工站内容"></el-table-column>
                        <el-table-column prop="MaterielCode" sortable label="物料代号Code" v-if="false"></el-table-column>
                        <el-table-column prop="MaterielNum" sortable label="物料代号"></el-table-column>
                        <el-table-column prop="MaterielName" sortable label="物料名称"></el-table-column>
                        <el-table-column prop="Description" sortable label="作业描述"></el-table-column>
                    </el-table>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="AddOverFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="AddOverForm">提 交</el-button>
            </div>
        </el-dialog>
        <!-- 修改 计件工资 -->
        <el-dialog title="修改计件工资" :visible.sync="EditOverFormVisible">
            <el-form :model="EditformOver" style="text-align: left;width: 90%;margin: auto;">
                <el-form-item  label="工号"  :label-width="EditformLabelWidthOver">
                    <el-input v-model="EditformOver.UserCode" :disabled="true" auto-complete="off" style="width: 50%"></el-input>
                </el-form-item>
                <!-- 修改  日期   》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》-->
                <el-form-item  label="日期"  :label-width="EditformLabelWidthOver">
                    <el-input v-model="EditformOver.WorkDate" :disabled="true" style="width:50%"></el-input>
                </el-form-item>
                <el-form-item label="工站代号" :label-width="AddformLabelWidthOver">
                    <el-input :disabled="true" v-model="EditformOver.WorkStationNum" auto-complete="off" style="width: 30%"></el-input>
                </el-form-item>
                <el-form-item label="工站名称" :label-width="AddformLabelWidthOver">
                    <el-input :disabled="true" v-model="EditformOver.WorkStationName" auto-complete="off" style="width: 30%"></el-input>
                </el-form-item>
                <el-form-item label="物料代号" :label-width="AddformLabelWidthOver">
                    <el-input :disabled="true" v-model="EditformOver.MaterielNum" auto-complete="off" style="width: 30%"></el-input>
                </el-form-item>
                <el-form-item label="物料名称" :label-width="AddformLabelWidthOver">
                    <el-input :disabled="true" v-model="EditformOver.MaterielName" auto-complete="off" style="width: 30%"></el-input>
                </el-form-item>
                <el-form-item label="作业描述"   :label-width="EditformLabelWidthOver">
                    <el-input :disabled="true" v-model="EditformOver.Description" auto-complete="off" style="width: 30%"></el-input>
                </el-form-item>
                <el-form-item label="单价" :label-width="EditformLabelWidthOver">
                    <el-input :disabled="true" v-model="EditformOver.UnitPrice" auto-complete="off" style="width: 30%"></el-input>
                </el-form-item>
                <el-form-item label="数量" :label-width="EditformLabelWidthOver">
                    <el-input v-model="EditformOver.Quantity" auto-complete="off" style="width: 30%"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="EditOverFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="EditOverForm">提 交</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script type="text/ecmascript-6">
    export default{
        data(){
            return {
                //    计时工资  表格
                TimeTableData:[],
                //   查询条件 >>》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》。。
                UserName:'',  //  姓名
                UserCode:'',  //  工号
                //     分页
                PageCount:10,    // 每页几条   page-size
                CurrentPage:1,   // 当前是第几页
                Total:0,         // 总数
                //  工厂
                FactoryOptions:[],    //  工厂   一加载页面就出现工厂的下拉框
                valueFactory:'',    //  选择的是哪个工厂号
                //  部门
                DepartOptions:[],    // 一选择工厂就确定有哪些部门
                valueDepart:'',    //  选择的是哪个部门
                //  科室
                OfficeOptions:[],    //  工厂   一选择部门就确定有哪些科室
                valueOffice:'',    //  选择的是哪个科室
                //  职务职级
                DutyOptions:[],
                valueDuty:'',
                //  计算 薪资
                TimeFormVisible: false,
                formTime:{
                    //  应发
                    Y_BasicWage:0 ,
                    Y_AchievementBonus:0 ,  //  考核工资
                    Y_PostAllowance:0 ,    //  岗位津贴
                    Y_PerfectAttendance:0 ,   //  全勤奖
                    Y_PieceWorkWage: 0 ,     //  计件工资
                    //  实发
                    S_BasicWage: 0 ,
                    S_AchievementBonus:0 ,   //  考核
                    S_PostAllowance: 0 ,    //  岗位津贴
                    S_PerfectAttendance: 0 ,   //  全勤奖
                    S_PieceWorkWage : 0 ,     //  计件工资
                },
                formLabelWidthTime:'100',
//  计算薪资点开之后   工号  应发 的数据  一开始就要显示出来
                _JobNumber:0,   //  工号
                PayTotal:0 ,   //  总计
//   计算计件工资
                tableOver:[],  //  计件表格
                OverFormVisible: false,
                formOver:{},
                formLabelWidthOver:'100',
            //  所有 工站
                StationOptions:[],    //  工站  点击 计件工资  就加载
                valueStation:'',    //  选择的是哪个工站号
//            //  所有 物料
                MaterielOptions:[],    //  物料  点击 计件工资  就加载
                valueMateriel:'',    //  选择的是哪个物料号
                //  新增计件工资
                AddOverFormVisible: false,
                AddformOver:{
                    WorkDate:'',
                    Quantity:0,
                },
                AddformLabelWidthOver:'100',
                //  新增的  工站 物料  表格
                StationMarielTable:[] ,
                StationTable:[] ,    //  ref
                multipleSelection:[],   //  集合（一条）
                IDArr:[],   //  集合ID
                //  修改 计件工资
                EditOverFormVisible: false,
                EditformOver:{},
                EditformLabelWidthOver:'100',
                //  所有 工站
                EditStationOptions:[],    //  工站  点击 计件工资  就加载
                //  所有 物料
                EditMaterielOptions:[],    //  物料  点击 计件工资  就加载
            }
        },
        methods: {
            //    分页
            handleSizeChange(val) {
                this.PageCount = val ;   //  每页几条
                this.SelectTimeTable();
            },
            handleCurrentChange(val) {
                this.CurrentPage = val ;   // 当前是第几页
                this.SelectTimeTable();     //  点击分页的时候
            },
            //   一加载页面就应该知道有哪些工厂
            GetFactory(){    // 校验输入信息正确性 ，不对直接  return
                let url = "http://192.168.3.238:8088/Department/GetFactoryInfo" ;
                this.$http.get(url,).then(response => {
                    this.FactoryOptions = [];
                    let Code = response.data.Code;
                    if(Code == 200){   // 正常请求到数据
                        this.FactoryOptions = response.data.ObjList ;
                    }
                }, response => {
                    console.log(" 工厂请求失败");
                    console.log(response)
                })
            },
            //  一选择工厂，就知道有哪些部门
            GetDepart(){
                let url = "http://192.168.3.238:8088/Department/GetParentDepartment?FactoryID=" + this.valueFactory ;
                this.$http.get(url,).then(response => {
                    let Code = response.data.Code;
                    console.log("隶属部门 ");
//                    console.log(response.data);
                    if(Code == 200){   // 正常请求到数据
                        this.DepartOptions = response.data.ObjList ;
                    }
                }, response => {
                    console.log(" 父级请求失败");
                    console.log(response)
                })
            },
            //  一选择部门，就知道有哪些科室 和  职务职级
            GetOfficeDuty(){
                let url = "http://192.168.3.238:8088/OfficeManager/GetOfficeByPre?DepartCode=" + this.valueDepart ;
                this.$http.get(url,).then(response => {
                    let Code = response.data.Code;
                    if(Code == 200){   // 正常请求到数据
                        this.OfficeOptions = response.data.ObjList ;
                    }
                }, response => {
                    console.log(" 请求失败");
                    console.log(response)
                });

                let DutyUrl = "http://192.168.3.238:8088/RankDuty/GetAllRankDuty?DepartCode=" + this.valueDepart ;
                console.log(DutyUrl)
                this.$http.get(DutyUrl,).then(response => {
                    let Code = response.data.Code;
                    console.log("职务职级 》》》》》》》》》》》》》》》》》》》》》》》》》》》》》》 ");
                    console.log(response.data);
                    if(Code == 200){   // 正常请求到数据
                        this.DutyOptions = response.data.ObjList ;
                    }
                }, response => {
                    console.log(" 职务职级请求失败");
                    console.log(response)
                })
            },
            //  显示薪资  表格   get  传给后台值  供查询使用    已完
            SelectTimeTable(){    // 校验输入信息正确性 ，不对直接  return
                let url = "http://192.168.3.238:8088/UserInfo/GetUserInfoByWageWay?WageSettlementMode=3" +
                    "&UserCode=" + this.UserCode+ "&UserName=" + this.UserName+
                    "&FactoryID=" + this.valueFactory+ "&DepartCode=" + this.valueDepart+
                    "&OfficeCode=" + this.valueOffice+ "&RankID=" +this.valueDuty+
                    "&PageCount="+this.PageCount+"&CurrentPage="+ this.CurrentPage;
                console.log(url);
                this.$http.get(url,).then(response => {
                    this.TimeTableData = [] ;
                    // success callback   需要一个alert告诉你查询到了
                    let Code = response.data.Code;
                    if(Code == 200){   // 正常请求到数据
                        this.Total = response.data.Total;
                        for(let i=0;i<response.data.ObjList.length;i++){
                            this.TimeTableData.push(response.data.ObjList[i]);
                            response.data.ObjList[i].index=i+1;
                        }
                    }
                    console.log("薪资表格 >>>>>>>>>>>>>>>>>.... ")
                    console.log(response)
                }, response => {
                    console.log(" 表格添加失败")
                    console.log(response)
                })
            },
            //  计算薪资  按钮
            handleEmSalary(index, row) {
                this.TimeFormVisible = true;
                this.formTime = row;
                this._JobNumber = row.UserCode ;
                this.GetTime();
                console.log("formTime 是什么 >>>>>>>>>>>>  ");
                console.log(this._JobNumber)
            },
            //  应发的各项工资数据    应发  实发
            GetTime(){
                let url = "http://192.168.3.238:8088/PayOffInfo/GetPayOffInfo?UserCode=" + this._JobNumber;
                console.log(url);
                this.$http.get(url,).then(response => {
                    // success callback   需要一个alert告诉你查询到了
                    let Code = response.data.Code;
                    if(Code == 200){   // 正常请求到数据
                        for(let i=0;i<response.data.ObjList.length;i++){
                            this.formTime = response.data.ObjList[i] ;
                        }
                        console.log("formTime");
//                        console.log(this.formTime);
                    }
                    this.PayTotal = this.formTime.S_BasicWage + this.formTime.S_AchievementBonus + this.formTime.S_PostAllowance + this.formTime.S_PerfectAttendance + this.formTime.S_OverTimeWage;
                    console.log("计件薪资   ");
//                    console.log(response)
                }, response => {
                    console.log(" 表格添加失败")
                    console.log(response)
                })
            },
            //  点击 计算薪资  确定按钮
            TimeForm(){
                let Url = "http://192.168.3.238:8088/PayOffInfo/UpdatePayOffInfo";
                let Item = {   //  跟后端约定好的JSON格式
                    "UserCode":this._JobNumber,
                    "BasicWage":this.formTime.S_BasicWage,       //  固定
                    "AchievementBonus":this.formTime.S_AchievementBonus,   //  考核
                    "PostAllowance":this.formTime.S_PostAllowance,     //  岗位津贴
                    "PerfectAttendance":this.formTime.S_PerfectAttendance,   // 全勤奖
                    "PieceWorkWage":parseInt(this.formTime.S_PieceWorkWage),   // 计件工资
                    "OperationUser":1,
                };
                console.log("计算工资")
                let that = this;  //   that管用吗   管用的，想自动刷新就在执行成功的方法里重新  searchTable 就行了
                this.$http.post(Url, Item, {
                    headers: {
                        'Content-Type': 'application/x-www-form-urlencoded'
                    }
                })
                    .then(function (response) {
                        that.TimeFormVisible = false;     //  关闭窗口
                        console.log("计算计件工资成功 》");
                        console.log(response);
//                        需要提示
                    })
                    .catch(function (error) {
                        console.log("错误");
                        console.log(error);
                    });
            },
            A(){
                if(this.UserCode == 0){
                    this.UserCode = null ;
                }
            },
//    计件工资
            handleOver(index, row) {
                this.OverFormVisible = true;
                this.formOver = row;
                this._JobNumber = row.UserCode ;
                this.GetOverTable();
                console.log("formOver 是什么  ");
                console.log(this._JobNumber)
            },
            //  计件  表格
            GetOverTable(){
                let url = "http://192.168.3.238:8088/PieceWork/GetPieceWork?UserCode=" + this._JobNumber;
                console.log(url);
                this.$http.get(url,).then(response => {
                    // success callback   需要一个alert告诉你查询到了
                    let Code = response.data.Code;
                    if(Code == 200){   // 正常请求到数据
                        this.tableOver = [] ;
                        for(let i=0;i<response.data.ObjList.length;i++){
                            this.tableOver.push(response.data.ObjList[i]) ;
                            response.data.ObjList[i].index=i+1;
                        }
                    }
                    console.log("计件表格 200 ok ");
                    console.log(response)
                }, response => {
                    console.log(" 表格添加失败")
                    console.log(response)
                })
            },
            //  点击 计件  确定  按钮
            TimePieceForm(){
                this.OverFormVisible = false;
            },
            //  选择  工站 物料 的集合（只能选择一条）
            handleSelectionChange(val) {
                this.multipleSelection = val;
                console.log("handleSelectionChange 》》》》》》");
                console.log(this.multipleSelection);
                this.IDArr = [];
                //  需要判断 >》》》》》》》》》》》》》》》》》》》》》
                for(let i= 0; i<val.length; i++){
                    console.log(this.multipleSelection[i].ID);
                    this.IDArr.push(this.multipleSelection[i].ID) ;
                    console.log("数组")
                    console.log(this.IDArr)
                }
                console.log("IDArr 》》》》》》》》》》》》》")
                console.log(this.IDArr)
            },
            //   获得所有 工站 物料
            GetStationMariel(){
                let url = "http://192.168.3.238:8088/PieceBasis/GetPieceBasis" ;
                this.$http.get(url,).then(response => {
                    let Code = response.data.Code;
                    console.log("计件基础报表 ");
                    console.log(response.data);
                    if(Code == 200){   // 正常请求到数据
                        for(let i=0;i<response.data.ObjList.length;i++){
                            this.StationMarielTable.push(response.data.ObjList[i]);
                            response.data.ObjList[i].index=i+1;
                        }
                    }
                }, response => {
                    console.log(" 父级请求失败");
                    console.log(response)
                })
            },
            //  新增 计件工资
            AddOver() {
                this.IDArr = [];
                this.GetStationMariel();   //  获取所有工站  物料
                if(this.AddformOver.WorkType == 0){
                    this.AddformOver.WorkType = null ;
                }
                this.AddOverFormVisible = true;
                console.log("点击新增按钮 >>>>>>>>>>>>  ");
            },
            //  点击 新增 确定按钮
            AddOverForm(){
                let addUrl = "http://192.168.3.238:8088/PieceWork/AddPieceWork";
                let AddForm = {
                    "UserCode":this._JobNumber,    //  工号
                    "WorkDate":this.formatDate(this.AddformOver.WorkDate),
                    //   传过去一个  集合  工站 物料
                    "PieceBasisID":this.IDArr,
                    "Quantity":this.AddformOver.Quantity ,   //  件数
                    "OperationUser":1,    //  操作者工号
                };
                console.log("新增时  日期 >>>>》》》》》》》》》》》》》》》》 ");
//                console.log(addUrl);
//                console.log(AddForm);
//                console.log(this.valueMateriel);
                let that = this ;
                if(this.AddformOver.WorkDate.length === 0){
                    alert("日期不能为空");
                    return 0;
                }
                else{
                    this.$http.post(addUrl, AddForm, {
                        headers: {
                            'Content-Type': 'application/x-www-form-urlencoded'
                        }
                    })
                    .then(function (response) {
                        console.log("添加成功");
                        console.log(response);
                        if(response.data.Message == "同一天不能重复添加"){
                            alert("同一天不能重复添加")
                        }else{
                            that.AddOverFormVisible = false ;
                            that.GetOverTable();
                        }
                    })
                    .catch(function (error) {
                         console.log("错误");
                         console.log(error);
                    });
                }
            },
            //  修改  计件工资
            EditHandleOver(index, row) {
                this.EditformOver = row;
                this._JobNumber = row.UserCode ;
                this.EditOverFormVisible = true;
                console.log("EditformOver");
                console.log(this.EditformOver)
            },
            //  编辑 点击 提交按钮
            EditOverForm(){
                let EditUrl = "http://192.168.3.238:8088/PieceWork/UpdatePieceWork";
                let EditForm = {
                    "ID": this.EditformOver.ID,
                    "UserCode": this.EditformOver.UserCode,     //  工号
                    "Quantity": this.EditformOver.Quantity,     //  数量
                    "UnitPrice":this.EditformOver.UnitPrice ,   //  单价
                    "OperationUser": 1,    //  操作者工号
                };
                console.log("EditForm 修改 》》》》》》》》》》》》》》》》》》》》》 ");
                console.log(EditForm);
                let that = this ;
                if(this.EditformOver.WorkDate.length === 0){
                    alert("日期不能为空");
                    return 0;
                }
                else{
                    this.$http.post(EditUrl, EditForm, {
                        headers: {
                            'Content-Type': 'application/x-www-form-urlencoded'
                        }
                    })
                        .then(function (response) {
                            console.log("编辑 成功 》》》》》》》》》》》》》》》》》》》》 ");
                            console.log(response);
                            that.EditOverFormVisible = false ;
                            that.GetOverTable();
                        })
                        .catch(function (error) {
                            console.log("错误");
                            console.log(error);
                        });
                }
            } ,

            // 新增时 获取所有工站
            GetAllStation(){
                let url = "http://192.168.3.238:8088/WorkStationManager/GetWorkStationByOfficeCode" ;
                this.$http.get(url,).then(response => {
                    this.StationOptions = [];
                    let Code = response.data.Code;
                    if(Code == 200){   // 正常请求到数据
                        this.StationOptions = response.data.ObjList ;
                    }
                    console.log("所有工站")
//                    console.log(this.StationOptions)
                }, response => {
                    console.log(" 工厂请求失败");
                    console.log(response)
                })
            },
            // 新增时 获取所有物料
            GetAllMater(){
                let url = "http://192.168.3.238:8088/MaterielManager/GetMaterielByType" ;
                this.$http.get(url,).then(response => {
                    this.MaterielOptions = [];
                    let Code = response.data.Code;
                    if(Code == 200){   // 正常请求到数据
                        this.MaterielOptions = response.data.ObjList ;
                    }
                    console.log("所有物料")
                    console.log(this.MaterielOptions)
                }, response => {
                    console.log(" 工厂请求失败");
                    console.log(response)
                })
            },

            // 修改时 获取所有工站
            EditGetAllStation(){
                let url = "http://192.168.3.238:8088/WorkStationManager/GetWorkStationByOfficeCode" ;
                this.$http.get(url,).then(response => {
                    this.EditStationOptions = [];
                    let Code = response.data.Code;
                    if(Code == 200){   // 正常请求到数据
                        this.EditStationOptions = response.data.ObjList ;
                    }
                    console.log("所有工站")
//                    console.log(this.StationOptions)
                }, response => {
                    console.log("工站请求失败");
                    console.log(response)
                })
            },
            // 修改时 获取所有物料
            EditGetAllMater(){
                let url = "http://192.168.3.238:8088/MaterielManager/GetMaterielByType" ;
                this.$http.get(url,).then(response => {
                    this.EditMaterielOptions = [];
                    let Code = response.data.Code;
                    if(Code == 200){   // 正常请求到数据
                        this.EditMaterielOptions = response.data.ObjList ;
                    }
                    console.log("所有物料")
//                    console.log(this.MaterielOptions)
                }, response => {
                    console.log(" 物料请求失败");
                    console.log(response)
                })
            },
            //  日期转换
            formatTen(num) {
                return num > 9 ? (num + "") : ("0" + num);
            } ,
            formatDate(date) {
//                let a = 'Fri Nov 10 2017 00:00:00 GMT+0800' ;
                let year,month,day;
                year = date.getFullYear();
                month = date.getMonth() + 1;
                day = date.getDate();
                console.log("日期 》》》》》》》》》》》");
                console.log(year + "-" + this.formatTen(month) + "-" + this.formatTen(day));
                return year + "-" + this.formatTen(month) + "-" + this.formatTen(day);
            }
    },
        mounted: function () {   //  onload
            this.SelectTimeTable();
            this.A();
            this.GetFactory();  //  工厂
        }
    }
</script>

<style>
    * {
        padding: 0;
    }

    html,
    body {
        height: 100%;
        width: 100%;
        overflow: hidden;
        margin: 0;
    }

    #salaryTime {
        height: 100%;
    }
    /* 表头数据居中 */
    .table_Time thead tr th {
        text-align: center;
    }

</style>